<template>
    <div class="booking_add" ref="booking_add">
        <div class="header">
          <img class="return_img" src="@/assets/Return.png" style="width:.23rem;height:.4rem;" v-on:click="back()"> 代客预定
        </div>
        <div class="tab">
            <p class="tab_type">预定类型</p>
            <div class="tab_radio">
                <span @click="toggle(1)">
                    <img  src="@/assets/radio2.png" style="width:.34rem;height:.34rem;" v-if="index==1">
                    <img  src="@/assets/radio.png" style="width:.34rem;height:.34rem;" v-if="index==2">
                    散客
                </span>
                <span @click="toggle(2)">
                    <img  src="@/assets/radio.png" style="width:.34rem;height:.34rem;" v-if="index==1">
                    <img  src="@/assets/radio2.png" style="width:.34rem;height:.34rem;" v-if="index==2">
                    单位
                </span>
            </div>          
        </div>
        <div v-if="index==1" class="sk">
            <div class="title">
                <div class="check">
                    <datetime title="入住" v-model="check_date" :start-date="startDate" :end-date="endDate" format="YYYY-MM-DD"></datetime>
                </div>
                <div class="total">共 {{ ftf_number }} 晚</div>
                <div class="leave">
                    <datetime title="离店" v-model="leave_date" :start-date="leave_startDate" format="YYYY-MM-DD"></datetime>
                </div>
            </div>
            <div class="booking_center">
              <group label-width="5em">
                <span class="company_img_r" style="position: absolute;top:.2rem;right:.18rem"><img src="@/assets/booking_right.png" alt=""></span>
                <popup-picker title="房型" :data="type_list" v-model="room_value" @on-show="room_show" @on-hide="room_hide" @on-change="roomChange(room_value)" placeholder="请选择房型"  style="margin-top:0">               
                </popup-picker>
              </group>
              <group label-width="5em">
                <span class="company_img_r" style="position: absolute;top:.2rem;right:.18rem"><img src="@/assets/booking_right.png" alt=""></span>
                <popup-picker title="早餐" :data="breakfast_list" v-model="breakfast_value" :disabled="breakfast_disabled" @click.native="room_click" @on-show="room_show" @on-hide="room_hide" @on-change="breakfastChange(breakfast_value)" placeholder="无"></popup-picker>
              </group>
              <group label-width="5em">
                <span class="company_img_r" style="position: absolute;top:.2rem;right:.18rem"><img src="@/assets/booking_right.png" alt=""></span>
                <popup-picker title="房间数" :data="number_list" v-model="number_value" @on-show="room_show" @on-hide="room_hide" @on-change="NumberChange(number_value)" placeholder="无"></popup-picker>
              </group>
              <div class="booking_cont">
                <span class="cont">房价</span>
                <span class="money">￥<input class="input colour" type="text" v-model.number="rooms_val"  @input="checkNumber(rooms_val)" :maxlength="maxlength"></span>
                <span class="between">/间</span>
              </div>
              <div class="booking_cont">
                <span class="cont">押金</span>
                <span class="money">￥<input class="input colour" type="text" v-model="deposit_val"  @input="checkNumber(deposit_val)" :maxlength="maxlength"></span>
                <span class="between">/间</span>
              </div>
              <div class="booking_cont">
                <span class="cont">预订人</span>
                <span><input class="input" type="text" v-model="Reservations" placeholder="预订人姓名"  maxlength="12" @focus="inpFocus" @blur="inpBlur"></span>
              </div>
              <div class="booking_cont">
                <span class="cont">联系手机</span>
                <span><input class="input" type="text" v-model="Phone" placeholder="用于接收信息/联系"  maxlength="11"  @focus="inpFocus" @blur="inpBlur"></span>
              </div>
              <div v-show="cancel_rule">
                <p class="cancel_rule" v-if="cancelRule == 1">取消规则：{{cancelHours}}:{{ cancelMinutes==0?cancelMinutes='00':cancelMinutes}}前可取消</p>
                <p class="cancel_rule" v-if="cancelRule == 0">取消规则：不可取消</p>
              </div>
             
            </div>          
        </div>
        <div v-if="index==2" class="dw">
          <div class="company"  @click="search_click">
            <span class="cont">单位名称</span>
            <span>{{ company_text }}</span>
            <span class="company_img_r"><img src="@/assets/booking_right.png" alt=""></span>   
          </div>
          <div v-transfer-dom>
            <popup v-model="search_show" position="left" width="100%">
              <div class="position-horizontal-demo">
                <div class="header">
                  <img class="return_img" src="@/assets/Return.png" style="width:.23rem;height:.4rem;" v-on:click="return_add()"> 协议单位选择
                </div>
                <div class="vux-close">
                  <span class="company_search" style="position: relative">
                    <i class="iconfont icon-sousuo" style="position: absolute;top: -.08rem;left:.4rem"></i>
                    <input class="input" v-model="searchInputValue" 
                    style="margin:.2rem .25rem;width: 7rem;height: 0.6rem;border-radius: 1rem;padding-left:.6rem"
                     v-on:oninput ="handleinput(searchInputValue)" placeholder="搜索">
                  </span>
                  <div v-for="(n,i) in searchData" :key="i" 
                  style="background:#fff;border-bottom:1px solid #f3f3f3;height:.8rem;line-height:.8rem;color:.24rem;padding-left:.25rem">
                      <div  @click="Choice(n)" class="search_text">{{n.agreementName}}</div>
                  </div>
                </div>
              </div>
            </popup>
          </div>
          <div class="title">
                <div class="check">
                    <datetime title="入住" v-model="company_check_date" :start-date="company_startDate" :end-date="company_endDate"></datetime>
                </div>
                <div class="total">共 {{company_number}} 晚</div>
                <div class="leave">
                    <datetime title="离店" v-model="company_leave_date" :start-date="company_leave_startDate"></datetime>
                </div>
            </div>
            <div class="booking_center">
              <group label-width="5em">
                <span class="company_img_r" style="position: absolute;top:.2rem;right:.18rem"><img src="@/assets/booking_right.png" alt=""></span>
                <popup-picker title="房型" :data="company_type_list" v-model="company_room_value" :disabled="company_room_disabled" @click.native="company_room_click(company_room_value)" @on-show="room_show" @on-hide="room_hide" @on-change="CompanyTypeChange(company_room_value)" placeholder="请选择房型"  style="margin-top:0"></popup-picker>
              </group>
              <group label-width="5em">
                <span class="company_img_r" style="position: absolute;top:.2rem;right:.18rem"><img src="@/assets/booking_right.png" alt=""></span>
                <popup-picker title="早餐" :data="company_breakfast_list" v-model="company_breakfast_value" :disabled="company_breakfast_disabled" @click.native="company_breakfast_click" @on-show="room_show" @on-hide="room_hide" placeholder="请选择早餐"></popup-picker>
              </group>
              <group label-width="5em">
                <span class="company_img_r" style="position: absolute;top:.2rem;right:.18rem"><img src="@/assets/booking_right.png" alt=""></span>
                <popup-picker title="房间数" :data="company_number_list" v-model="company_number_value" @on-show="room_show" @on-hide="room_hide" @on-change="CompanyNumberChange(company_number_value)" placeholder="请选择房间"></popup-picker>
              </group>
              <div class="booking_cont">
                <span class="cont">房价</span>
                <span class="money">￥<input class="input colour" type="text" v-model="company_rooms_val"  @input="checkNumber(company_rooms_val)" :maxlength="maxlength"></span>
                <span class="between">/间</span>
              </div>
              <div class="booking_cont">
                <span class="cont">押金</span>
                <span class="money">￥<input class="input colour" type="text" v-model="company_deposit_val" @input="checkNumber(company_deposit_val)" :maxlength="maxlength"></span>
                <span class="between">/间</span>
              </div>
              <div class="booking_cont">
                <span class="cont">预订人</span>
                <span><input class="input" type="text" v-model="company_Reservations" placeholder="预订人姓名" maxlength="12"  @focus="inpFocus" @blur="inpBlur"></span>
              </div>
              <div class="booking_cont">
                <span class="cont">联系手机</span>
                <span><input class="input" type="text" v-model="company_Phone" placeholder="用于接收信息/联系" maxlength="11"  @focus="inpFocus" @blur="inpBlur"></span>
              </div>
              <p class="cancel_rule" v-show="company_cancel_rule">取消规则：18:00前可取消</p>
            </div>   
        </div>
        <div v-transfer-dom class="transfer">
          <popup v-model="show" is-transparent>
            <div>
              <group>               
                <template slot="title" slot-scope="props">
                    <div class="props_title">
                      <span class="props_totl">总价</span>
                      <span class="props_money" v-show="TotalPrice">￥{{ TotalPrice.toFixed(2) }}</span>
                    </div>
                    <div v-for="(item,index) in DetailedList" :key="index" style="display: flex;color:#999;font-size:.2rem">             
                      <span style="width:3rem;">{{ item.date }}({{ item.breakfastName }})</span>
                      <span style="flex:1;text-align: center;">{{ item.name }}</span>
                      <span style="flex:1;text-align: right;">{{ rooms_number }} x ￥{{ item.salePrice }}</span>
                    </div>
                    <div style="text-align:  right;color:#999;font-size:.2rem">
                      <span style="float:left;">押金</span>
                      <span v-show="deposit">￥{{ deposit }}</span>
                    </div>
                </template>                
              </group>              
            </div>
          </popup>
        </div>
        <div class="footer" v-show="hidshow">
            <p class="price">总价<span>￥{{ TotalPrice.toFixed(2) }}</span></p>
            <div class="Detailed" @click="Detailed">明细</div>   
            <p class="btn">
              <x-button @click.native="onItemClick" :class="{'class-b': cont_active}">{{ cont_text }}</x-button>  
            </p>              
        </div>
        <toast v-model="showPositionValue_sure" type="text" text="保存成功" width="4.6rem"></toast>   
        <!-- 提示分享 -->
        <div v-transfer-dom>
          <x-dialog v-model="showDialogStyle" hide-on-blur :dialog-style="{'max-width': '100%', width: '100%', height: '100%', 'background-color': 'transparent'}">
            <div style="color:#fff;text-align:center;height:100%;" @click="showDialogStyle = false">
              <div class="content">
                  <p  class="tishi"><img src="@/assets/tishi.png" alt="" style="width:3rem"></p>
                  <p style="font-size:.48rem">请点击右上角分享</p>
              </div>
            </div>
          </x-dialog>
        </div>
        <toast v-model="showPositionValue" type="text" :text="toast_text"></toast>
    </div>
</template>
<script>
import {
  getAgreementUnitList,
  getReserveRoomType,
  getRoomPrices,
  addOrder
} from "@/service/home.js";
import {
  PopupPicker,
  Group,
  XButton,
  Datetime,
  Actionsheet,
  TransferDom,
  Popup,
  Cell,
  Toast,
  XDialog
} from "vux";
import { fail } from "assert";
import axios from "axios";
import wx from "weixin-js-sdk";
import { setTimeout } from "timers";
export default {
  directives: {
    TransferDom
  },
  components: {
    PopupPicker,
    Group,
    XButton,
    Datetime,
    Actionsheet,
    Popup,
    Cell,
    Toast,
    XDialog
  },
  inject: ["reload"],
  data() {
    return {
      index: 1,
      userId: localStorage.getItem("id"),
      companyId: localStorage.getItem("companyId"),
      agreementHeadId: "",
      breakfastName: "",
      roomTypeList: "",
      salePrice: "",
      TotalPrice: 0,
      DetailedNumber: "",
      breakfast: "",
      agreementId: "", //新增接口参数
      agreementPrice: "",
      room_id: "",
      bookingRoomsNum: 1,
      bookingSellingRoom: "",
      pricesList: [],
      deposit: "",
      sellPrice: "",
      DetailedList: [],
      type_list: [],
      number_list: [
        ["1间", "2间", "3间", "4间", "5间", "6间", "7间", "8间", "9间", "10间"]
      ],
      room_value: [],
      breakfast_list: [],
      breakfast_value: [],
      number_value: ["1间"],
      rooms_val: 0,
      deposit_val: 0,
      Reservations: "",
      Phone: "",
      check_date: "",
      leave_date: "",
      show: false,
      showPositionValue_sure: false,
      showDialogStyle: false,
      showPositionValue: false,
      toast_text: "",
      company_check_date: "", //单位入住时间
      company_leave_date: "", //单位离店时间
      company_type_list: [],
      company_breakfast_list: [],
      company_number_list: [
        ["1间", "2间", "3间", "4间", "5间", "6间", "7间", "8间", "9间", "10间"]
      ],
      company_room_value: [],
      company_breakfast_value: [],
      company_number_value: ["1间"],
      company_rooms_val: 0,
      company_deposit_val: 0,
      company_Reservations: "",
      company_Phone: "",
      company_text: "请输入单位名称或协议编号",
      search_show: false,
      searchInputValue: "",
      aUnitList: [],
      orderNum: "",
      footer_show: true,
      breakfast_disabled: true,
      company_room_disabled: true,
      company_breakfast_disabled: true,
      startDate: "", //散客入住开始时间
      endDate: "", //散客入住结束时间
      leave_startDate: "", //散客离店开始时间

      company_startDate: "", //单位入住开始时间
      company_endDate: "", //单位入住结束时间
      company_leave_startDate: "", //单位离店开始时间
      number: "",
      roomChangeValue: "",
      isDisable: true,
      cancelHours: "", //取消规则小时
      cancelMinutes: "", //取消规则分钟
      cancel_rule: false, //散客取消规则设置隐藏显示
      company_cancel_rule: false, //单位取消规则设置隐藏显示
      maxlength: 7,
      hotelName: localStorage.getItem("hotelName"),

      docmHeight: "0", //默认屏幕高度
      showHeight: "0", //实时屏幕高度
      hidshow: true, //显示或者隐藏footer,
      isResize: false, //默认屏幕高度是否已获取
      cancelRule: "", //取消规则
      rooms_number: 1,
      roomNum: "",
      isCanScroll: false,
      company_type_num: true, //判断单位是否有售卖房型
      cont_text: "保存",
      cont_active: false
    };
  },
  watch: {
    isCanScroll(value) {
      if (value) {
        this.$refs.booking_add.scrollIntoView();
      }
    },
    showHeight: function() {
      if (this.docmHeight < this.showHeight) {
        this.hidshow = true;
      } else {
        this.hidshow = false;
      }
    },
    ftf_number: {
      handler(newName, oldName) {
        if (newName) {
          this._getRoomPrices();
        }
      },
      deep: true
    },
    company_number: {
      handler(newName, oldName) {
        if (newName) {
          this._getRoomPrices();
        }
      },
      deep: true
    },
    rooms_val: {
      handler(newName, oldName) {
        if (newName < 0) {
          this.rooms_val = 0;
        }
        if (newName) {
          if (this.room_value.length != 0) {
            this.DetailedList.forEach(item => {
              item.salePrice = newName;
            });

            this.salePrice = newName;
            this.TotalPrice =
              this.rooms_number * newName * this.number + this.deposit;
          }
          if (isNaN(newName) || isNaN(this.deposit_val)) {
            this.TotalPrice = 0.0;
            this.showPositionValue = true;
            this.toast_text = "请输入正确房价";
            return false;
          }
          //限制小数点后2位数
          var index = String(newName).indexOf(".");
          if (index != -1) {
            if (index == 0) {
              this.rooms_val = 0;
            }
          }
        }
      },
      deep: true
    },
    deposit_val: {
      handler(newName, oldName) {
        if (newName < 0) {
          this.rooms_val = 0;
        }
        if (newName) {
          if (this.room_value.length != 0) {
            this.deposit = "";
            this.deposit = this.deposit_val * this.rooms_number;
            this.TotalPrice =
              this.rooms_number * this.salePrice * this.number + this.deposit;
          }
          if (isNaN(newName) || isNaN(this.rooms_val)) {
            this.TotalPrice = 0.0;
            this.showPositionValue = true;
            this.toast_text = "请输入正确押金";
            return false;
          }
          //限制小数点后2位数
          var index = String(newName).indexOf(".");
          if (index != -1) {
            console.log(index);
            if (index == 0) {
              this.deposit_val = 0;
            }
          }
        }
      },
      deep: true
    },
    number_value: {
      handler(newName, oldName) {
        var rooms_number = newName[0];
        if (newName) {
          switch (rooms_number) {
            case "1间":
              this.rooms_number = 1;
              break;
            case "2间":
              this.rooms_number = 2;
              break;
            case "3间":
              this.rooms_number = 3;
              break;
            case "4间":
              this.rooms_number = 4;
              break;
            case "5间":
              this.rooms_number = 5;
              break;
            case "6间":
              this.rooms_number = 6;
              break;
            case "7间":
              this.rooms_number = 7;
              break;
            case "8间":
              this.rooms_number = 8;
              break;
            case "9间":
              this.rooms_number = 9;
              break;
            case "10间":
              this.rooms_number = 10;
              break;
          }
        }
        this.deposit = this.rooms_number * this.deposit_val;
        console.log(this.salePrice, this.rooms_number);
        this.TotalPrice =
          this.salePrice * this.rooms_number * this.ftf_number + this.deposit;
      },
      deep: true
    },
    company_number_value: {
      handler(newName, oldName) {
        var rooms_number = newName[0];
        if (newName) {
          switch (rooms_number) {
            case "1间":
              this.rooms_number = 1;
              break;
            case "2间":
              this.rooms_number = 2;
              break;
            case "3间":
              this.rooms_number = 3;
              break;
            case "4间":
              this.rooms_number = 4;
              break;
            case "5间":
              this.rooms_number = 5;
              break;
            case "6间":
              this.rooms_number = 6;
              break;
            case "7间":
              this.rooms_number = 7;
              break;
            case "8间":
              this.rooms_number = 8;
              break;
            case "9间":
              this.rooms_number = 9;
              break;
            case "10间":
              this.rooms_number = 10;
              break;
          }
        }
        this.deposit = this.rooms_number * this.company_deposit_val;
        this.TotalPrice =
          this.salePrice * this.rooms_number * this.number + this.deposit;
      },
      deep: true
    },
    company_rooms_val: {
      handler(newName, oldName) {
        if (newName < 0) {
          this.company_rooms_val = 0;
        }
        if (newName) {
          if (this.company_room_value.length != 0) {
            this.DetailedList.forEach(item => {
              item.salePrice = newName;
            });
            this.salePrice = newName;
            this.TotalPrice =
              this.rooms_number * newName * this.number + this.deposit;
          }
          if (isNaN(newName) || isNaN(this.company_deposit_val)) {
            this.TotalPrice = 0.0;
            this.showPositionValue = true;
            this.toast_text = "请输入正确房价";
            return false;
          }
          //限制小数点后2位数
          var index = String(newName).indexOf(".");
          if (index != -1) {
            if (index == 0) {
              this.company_rooms_val = 0;
            }
            if (index == 0) {
              this.company_rooms_val = 0;
            }
          }
        }
      },
      deep: true
    },
    company_deposit_val: {
      handler(newName, oldName) {
        if (newName < 0) {
          this.company_deposit_val = 0;
        }
        if (newName) {
          if (this.company_room_value.length != 0) {
            this.deposit = "";
            this.deposit = this.company_deposit_val * this.rooms_number;
            this.TotalPrice =
              this.rooms_number * this.salePrice * this.number + this.deposit;
          }
          if (isNaN(newName) || isNaN(this.company_rooms_val)) {
            this.TotalPrice = 0.0;
            this.showPositionValue = true;
            this.toast_text = "请输入正确押金";
            return false;
          }
          //限制小数点后2位数
          var index = String(newName).indexOf(".");
          if (index != -1) {
            if (index == 0) {
              this.company_deposit_val = 0;
            }
          }
        }
      },
      deep: true
    },
    //散客离店时间
    leave_date: {
      handler(newName, oldName) {
        this.endDate = this.addDate_reduce(this.leave_date);
      }
    },
    //散客离店时间
    company_leave_date: {
      handler(newName, oldName) {
        this.company_endDate = this.addDate_reduce(this.company_leave_date);
      }
    }
  },
  computed: {
    searchData() {
      let searchInputValue = this.searchInputValue;
      //如果存在，根据条件过滤
      if (searchInputValue) {
        return this.aUnitList.filter(function(daily) {
          return Object.keys(daily).some(function(key) {
            return (
              String(daily[key])
                .toLowerCase()
                .indexOf(searchInputValue) > -1
            );
          });
        });
      }
      //如果不存在，整体返回
      return this.aUnitList;
    },
    //单位住宿时间
    company_number() {
      var time = this.DateMinus(
        this.company_check_date,
        this.company_leave_date
      );
      return time;
    },
    //散客住宿时间
    ftf_number() {
      var time = this.DateMinus(this.check_date, this.leave_date);
      return time;
    }
  },
  mounted() {
    // window.onresize监听页面高度的变化
    window.onresize = () => {
      return (() => {
        if (!this.isResize) {
          //默认屏幕高度
          this.docmHeight = document.documentElement.clientHeight;
          this.isResize = true;
        }
        //实时屏幕高度
        this.showHeight = this.$refs["booking_add"].clientHeight;
      })();
    };
  },
  created() {
    let userId = localStorage.getItem("userId");
    if (userId) {
      localStorage.setItem("IosUserId", userId);
      this.userId = userId;
    }
    this._getAgreementUnitList();
    if (this.index == 1) {
      this._getReserveRoomType();
    }
    this.GetDate();
  },
  methods: {
    inpFocus() {
      this.isCanScroll = false;
    },
    inpBlur() {
      this.isCanScroll = true;
    },
    // 获取协议单位
    _getAgreementUnitList() {
      let ioscompanyId = localStorage.getItem("ioscompanyId");
      if (ioscompanyId) {
        this.companyId = ioscompanyId;
        this.cont_text = "保存并分享";
        this.cont_active = true;
      }
      var data = {
        companyId: this.companyId,
        state: 0
      };
      getAgreementUnitList(data).then(res => {
        this.aUnitList = res.data.aUnitList;
      });
    },
    //获取房型
    _getReserveRoomType() {
      var agreementHeadId = this.index == 2 ? this.agreementHeadId : 0;
      var data = {
        agreementHeadId: agreementHeadId,
        breakfastName: this.agreementName,
        companyId: this.companyId,
        userId: this.userId
      };

      getReserveRoomType(data).then(res => {
        this.roomTypeList = res.data.roomTypeList;
        var array = [];
        var type_list = [];
        var company_type_list = [];
        if (this.roomTypeList) {
          this.roomTypeList.forEach(item => {
            array.push(item.name);
          });
        }

        if (this.index == 2) {
          this.company_type_num = true;
          if (this.roomTypeList) {
            company_type_list[0] = array;
          }
          this.company_type_list = company_type_list; // 单位
          if (res.data.errMsg == "没有该售卖房型!") {
            this.company_breakfast_list[0] = [""];
            this.company_type_num = false;
            // this.company_breakfast_value = [];
            // this.company_room_value = [];
            var company_errMsg = res.data.errMsg;
            this.showPositionValue = true;
            this.toast_text = company_errMsg;
            return false;
          }
        } else {
          type_list[0] = array;
          this.type_list = type_list; // 散客
          this.breakfast_list[0] = [""];
        }
      });
    },
    //获取房价
    _getRoomPrices() {
      var breakfast, endTime, startTime;
      if (this.index == 2) {
        breakfast = 0;
        startTime = this.company_check_date;
        endTime = this.company_leave_date;
      } else {
        this.agreementHeadId = 0;
        startTime = this.check_date;
        endTime = this.leave_date;
        breakfast = this.breakfast;
      }
      var data = {
        agreementHeadId: this.agreementHeadId,
        breakfast: breakfast,
        companyId: this.companyId,
        endTime: endTime,
        replaceType: this.index,
        roomId: this.room_id,
        startTime: startTime,
        userId: this.userId,
        viewTag: 0
      };
      console.log(data);
      getRoomPrices(data).then(res => {
        this.salePrice = res.data.pricesList[0].salePrice;
        this.company_rooms_val = this.salePrice;
        this.rooms_val = this.salePrice;
        this.agreementPrice = res.data.agreementPrice;
        this.bookingSellingRoom = res.data.saleRoomId;
        this.cancelHours = res.data.cancelHours;
        this.cancelMinutes = res.data.cancelMinutes;
        this.cancelRule = res.data.cancelRule;
        this.pricesList = res.data.pricesList;
        this.roomNum = res.data.roomNum;
        if (this.index == 1) {
          this.number = this.ftf_number;
          switch (this.breakfast) {
            case 1:
              this.breakfastName = "含早";
              break;
            case 2:
              this.breakfastName = "单早";
              break;
            case 3:
              this.breakfastName = "双早";
              break;
          }
          this.deposit = this.deposit_val * this.rooms_number;
        } else {
          this.number = this.company_number;
          this.deposit = this.company_deposit_val * this.rooms_number;
        }

        this.TotalPrice =
          this.salePrice * this.number * this.rooms_number + this.deposit;
        this.DetailedList.length = 0;
        for (let i = 0; i <= this.number - 1; i++) {
          var date;
          if (this.index == 1) {
            date = this.addDate(this.check_date, i);
          } else {
            date = this.addDate(this.company_check_date, i);
          }
          this.DetailedList.push({
            date: date,
            salePrice: this.salePrice,
            breakfastName: this.breakfastName,
            name: this.roomChangeValue
          });
          console.log(this.DetailedList);
        }
      });
    },
    back() {
      this.$router.push({ path: "/my/SubstituteBooking/index" });
    },
    toggle(index) {
      this.index = index;
      this.DetailedList.length = 0;
      this.TotalPrice = 0;
      this.deposit = "";
      this.rooms_number = 1;

      if (index == 1) {
        //this.company_text = "";
        this.room_value.length = 0;
        this.breakfast_value.length = 0;
        this.breakfast_list[0] = [""];
        this.rooms_val = 0;
        this.deposit_val = 0;
        this.Reservations = "";
        this.Phone = "";
      } else {
        this.company_room_value.length = 0;
        this.company_breakfast_value.length = 0;
        this.company_breakfast_list[0] = [""];
        this.company_rooms_val = 0;
        this.company_deposit_val = 0;
        this.company_Reservations = "";
        this.company_Phone = "";
      }

      if (index == 1) {
        this._getReserveRoomType();
        this.company_cancel_rule = false;
        if (this.room_value.length == 0) {
          this.cancel_rule = false;
        } else {
          this.cancel_rule = true;
        }
      } else {
        this.cancel_rule = false;
        if (this.company_room_value.length == 0) {
          this.company_cancel_rule = false;
        } else {
          this.company_cancel_rule = true;
        }
      }
    },
    //散客选择房型
    roomChange(value) {
      let value_text = value.toString();
      this.roomTypeList.forEach(item => {
        if (value_text == item.name) {
          let breakfast = [];
          let breakfast_list = [];
          item.breakfast.forEach(i => {
            let list = i.breakfast;
            switch (list) {
              case 1:
                list = "含早";
                break;
              case 2:
                list = "单早";
                break;
              case 3:
                list = "双早";
                break;
            }
            breakfast.push(list);
            breakfast_list[0] = breakfast;
            this.breakfast_list = breakfast_list;
          });
          this.breakfast_value[0] = this.breakfast_list[0][0];
          this.deposit = item.deposit;
          this.room_id = item.room_id;
          this.deposit_val = item.deposit;
          switch (this.breakfast_value[0]) {
            case "含早":
              this.breakfast = 1;
              break;
            case "单早":
              this.breakfast = 2;
              break;
            case "双早":
              this.breakfast = 3;
              break;
          }
        }
      });
      if (value) {
        this.roomChangeValue = value.join();
        console.log(this.roomChangeValue);
        this.breakfast_disabled = false;
        this.cancel_rule = true;
        this._getRoomPrices();
      }
    },
    //点击散客早餐
    room_click() {
      if (this.room_value.length == 0) {
        this.breakfast_disabled = true;
        this.showPositionValue = true;
        this.toast_text = "请选择房型";
      } else {
        this.breakfast_disabled = false;
      }
    },
    // 点击单位的房型
    company_room_click(value) {
      console.log(value);
      if (
        !this.company_text ||
        this.company_text == "请输入单位名称或协议编号"
      ) {
        this.company_room_disabled = true;
        this.showPositionValue = true;
        this.toast_text = "请选择单位";
      } else {
        this.company_room_disabled = false;
      }
    },
    //点击单位的早餐
    company_breakfast_click() {
      if (this.company_room_value.length == 0) {
        this.company_breakfast_disabled = true;
        this.showPositionValue = true;
        this.toast_text = "请选择房型";
      } else {
        this.company_breakfast_disabled = false;
      }
    },
    //开启弹框
    room_show() {
      this.hidshow = false;
    },
    //关闭弹框
    room_hide() {
      this.hidshow = true;
    },
    //散客选择房间价格
    breakfastChange(value) {
      var value_text = value.toString();
      switch (value_text) {
        case "含早":
          this.breakfast = 1;
          break;
        case "单早":
          this.breakfast = 2;
          break;
        case "双早":
          this.breakfast = 3;
          break;
      }
      this._getRoomPrices();
    },
    //散客房间数发生改变
    NumberChange(value) {
      var num = value.join().length;
      this.bookingRoomsNum =
        num == 2
          ? parseInt(value.join().substr(0, 1))
          : parseInt(value.join().substr(0, 2));
    },
    //单位房间数发生改变
    CompanyNumberChange(value) {
      var num = value.join().length;
      this.bookingRoomsNum =
        num == 2
          ? parseInt(value.join().substr(0, 1))
          : parseInt(value.join().substr(0, 2));
    },
    //单位选择房型发生改变
    CompanyTypeChange(value) {
      console.log(this.company_type_num);
      if (!this.company_type_num) {
        this.company_room_value = [];
        return false;
      }
      var value_text = value.toString();
      this.roomTypeList.forEach(item => {
        if (value_text == item.name) {
          this.deposit = item.deposit;
          this.sellPrice = item.sellPrice;
          this.room_id = item.room_id;
          this.company_deposit_val = item.deposit;
        }
      });

      this.company_breakfast_value.length = 0;
      this.company_breakfast_value.push(this.breakfastName);
      if (value) {
        this.company_cancel_rule = true;
        this.DetailedNumber = this.company_number;
        this._getRoomPrices();
      }
      if (value) {
        this.roomChangeValue = value.join();
        if (this.company_room_value.length == 0) {
          this.company_breakfast_disabled = true;
        } else {
          this.company_breakfast_disabled = false;
        }
      }
    },
    //保存
    onItemClick() {
      let leaveTime, liveTime, stayMobile, stayPerson;
      if (this.index == 1) {
        this.agreementId = 0;
        leaveTime = this.leave_date;
        liveTime = this.check_date;
        stayMobile = this.Phone;
        stayPerson = this.Reservations;
        if (this.room_value == "") {
          this.showPositionValue = true;
          this.toast_text = "请选择房型";
          return false;
        }
        if (this.breakfast_value == "") {
          this.showPositionValue = true;
          this.toast_text = "请选择早餐";
          return false;
        }
        if (this.number_value == "") {
          this.showPositionValue = true;
          this.toast_text = "请选择房间数";
          return false;
        }
        if (this.rooms_val == "") {
          this.showPositionValue = true;
          this.toast_text = "请输入房价";
          return false;
        }
        if (isNaN(this.rooms_val)) {
          this.showPositionValue = true;
          this.toast_text = "请输入正确房价";
          return false;
        }
        if (this.deposit_val == "") {
          this.showPositionValue = true;
          this.toast_text = "请输入押金";
          return false;
        }
        if (isNaN(this.deposit_val)) {
          this.showPositionValue = true;
          this.toast_text = "请输入正确押金";
          return false;
        }
        if (this.Reservations == "") {
          this.showPositionValue = true;
          this.toast_text = "请填写预定人";
          return false;
        }
        if (this.Phone == "") {
          this.showPositionValue = true;
          this.toast_text = "请填写手机号码";
          return false;
        } else {
          const reg = /^1[3|4|5|7|8][0-9]\d{8}$/;
          if (!reg.test(this.Phone)) {
            this.showPositionValue = true;
            this.toast_text = "请填写正确的手机号码";
            return false;
          }
        }
      } else {
        leaveTime = this.company_leave_date;
        liveTime = this.company_check_date;
        stayMobile = this.company_Phone;
        stayPerson = this.company_Reservations;
        if (this.company_text == "") {
          this.showPositionValue = true;
          this.toast_text = "请选择单位名称";
          return false;
        }
        if (this.company_room_value == "") {
          this.showPositionValue = true;
          this.toast_text = "请选择房型";
          return false;
        }
        if (this.company_breakfast_value == "") {
          this.showPositionValue = true;
          this.toast_text = "请选择早餐";
          return false;
        }
        if (this.company_number_value == "") {
          this.showPositionValue = true;
          this.toast_text = "请选择房间数";
          return false;
        }
        if (this.company_rooms_val == "") {
          this.showPositionValue = true;
          this.toast_text = "请输入房价";
          return false;
        }
        if (isNaN(this.company_rooms_val)) {
          this.showPositionValue = true;
          this.toast_text = "请输入正确房价";
          return false;
        }
        if (this.company_deposit_val == "") {
          this.showPositionValue = true;
          this.toast_text = "请输入押金";
          return false;
        }
        if (isNaN(this.company_deposit_val)) {
          this.showPositionValue = true;
          this.toast_text = "请输入正确押金";
          return false;
        }
        if (this.company_Reservations == "") {
          this.showPositionValue = true;
          this.toast_text = "请填写预定人";
          return false;
        }
        if (this.company_Phone == "") {
          this.showPositionValue = true;
          this.toast_text = "请填写手机号码";
          return false;
        } else {
          const reg = /^1[3|4|5|7|8][0-9]\d{8}$/;
          if (!reg.test(this.company_Phone)) {
            this.showPositionValue = true;
            this.toast_text = "请填写正确的手机号码";
            return false;
          }
        }
      }
      if (this.index == 1) {
        this.pricesList.forEach(item => {
          item.salePrice = parseFloat(this.rooms_val);
        });
      } else {
        this.pricesList.forEach(item => {
          item.salePrice = parseFloat(this.company_rooms_val);
        });
      }
      if (!this.isDisable) {
        return false;
      }
      this.isDisable = false;
      var floorPrice = Math.floor(this.TotalPrice * 100) / 100;
      var sellPrice = (floorPrice - this.deposit).toFixed(2);
      var data = {
        agreementId: this.agreementId,
        agreementPrice: this.agreementPrice,
        bookingRoom: this.room_id,
        bookingRoomsNum: this.rooms_number,
        bookingSellingRoom: this.bookingSellingRoom,
        deposit: this.deposit_val,
        floorPrice: floorPrice,
        leaveTime: leaveTime,
        liveTime: liveTime,
        morning: this.breakfastName,
        orderId: 0,
        pricesList: this.pricesList,
        replaceType: this.index,
        sellPrice: sellPrice,
        stayMobile: stayMobile,
        stayPerson: stayPerson,
        suppliersId: this.companyId,
        userId: this.userId
      };
      if (this.rooms_number > this.roomNum) {
        this.showPositionValue = true;
        this.toast_text = "房间数量不足！";
        return false;
      } else {
        addOrder(data).then(res => {
          if (res.data.errCode == 0) {
            this.orderNum = res.data.orderNum;
            let ioscompanyId = localStorage.getItem("ioscompanyId");
            if (ioscompanyId) {
              let hotelName = localStorage.getItem("hotelName");
              let roomChangeValue = this.roomChangeValue;
              sharedAction(
                `您已经成功预订${hotelName}`,
                "http://test.staff.ihotelvip.com/my/SubstituteBooking/code?orderNum=" +
                  this.orderNum,
                `您预定的"${roomChangeValue}",请在30分钟内扫码支付，否则订单过期失效`
              );
            } else {
              this.isDisable = false; //执行请求后就不能点击了
              this.wechat();
              this.showPositionValue_sure = true;
              this.showDialogStyle = true;
            }
          }
        });
      }
    },
    Detailed() {
      this.show = !this.show;
    },
    handleinput(value) {
      if (value) {
      } else {
        this.searchVal_flg = true;
      }
    },
    search_click() {
      this.search_show = true;
      this.hidshow = false;
    },
    //选中的单位名称
    Choice(value) {
      console.log(value);
      this.company_room_value.length = 0;
      this.company_breakfast_value.length = 0;
      this.company_deposit_val = 0;
      this.company_rooms_val = 0;
      this.agreementId = value.id;
      this.company_text = value.agreementName;
      this.agreementName = value.agreementName;
      this.agreementHeadId = value.agreementHeadId;
      this.breakfastName = value.breakfastName;

      this.search_show = false;
      this.hidshow = true;
      if (this.company_text) {
        this.company_room_disabled = false;
      }
      var arr = [];
      var company_breakfast_list = [];
      arr.push(value.breakfastName);
      company_breakfast_list[0] = arr;
      this.company_breakfast_list = company_breakfast_list;
      this._getReserveRoomType();
    },
    return_add() {
      this.search_show = false;
      this.hidshow = true;
    },
    wechat() {
      var url = window.location.href;
      var hotelName = this.hotelName;
      var roomChangeValue = this.roomChangeValue;
      axios.post("/recommend/getPriceAgreement?url=" + url).then(res => {
        let links =
          "http://test.staff.ihotelvip.com/my/SubstituteBooking/code?orderNum=" +
          this.orderNum; //分享出去的链接
        let title = `您已经成功预订${hotelName}`; //分享的标题
        let desc = `您预定的"${roomChangeValue}",请在30分钟内扫码支付，否则订单过期失效`; //分享的详情介绍
        wx.config({
          debug: false,
          appId: "wx9a16008c72a9cf50",
          timestamp: res.data.timestamp,
          nonceStr: res.data.nonceStr,
          signature: res.data.qm,
          jsApiList: [
            "onMenuShareTimeline",
            "onMenuShareAppMessage",
            "onMenuShareQQ",
            "onMenuShareWeibo"
          ]
        });
        //直接调用
        wx.ready(function() {
          //分享给好友
          wx.onMenuShareAppMessage({
            title: title, // 分享标题
            desc: desc, // 分享描述
            link: links, // 分享链接
            imgUrl: "http://img.ihotelvip.com/1544419746942", // 分享图标
            success: function() {
              // 分享纪录
              alert("成功分享给朋友");
            },
            cancel: function() {
              alert("分享失败,您取消了分享!");
            }
          });
          wx.onMenuShareTimeline({
            title: title, // 分享标题
            desc: desc, // 分享描述
            link: links, // 分享链接
            imgUrl: "http://img.ihotelvip.com/1544419746942", // 分享图标
            success: function() {
              // 分享纪录
              alert("成功分享给朋友");
            },
            cancel: function() {
              alert("分享失败,您取消了分享!");
            }
          });
          wx.onMenuShareQQ({
            title: title, // 分享标题
            desc: desc, // 分享描述
            link: links, // 分享链接
            imgUrl: "http://img.ihotelvip.com/1544419746942", // 分享图标
            success: function() {
              // 分享纪录
              alert("成功分享给朋友");
            },
            cancel: function() {
              alert("分享失败,您取消了分享!");
            }
          });
          wx.onMenuShareWeibo({
            title: title, // 分享标题
            desc: desc, // 分享描述
            link: links, // 分享链接
            imgUrl: "http://img.ihotelvip.com/1544419746942", // 分享图标
            success: function() {
              // 分享纪录
              alert("成功分享给朋友");
              //logUtil.printLog("分享给朋友成功返回的信息为:",res);
            },
            cancel: function() {
              alert("分享失败,您取消了分享!");
            }
          });
        });
        //失败回调
        wx.error(function(res) {});
      });
    },
    checkNumber(withdrawAmount) {
      // //限制小数点后2位数
      // var index = String(withdrawAmount).indexOf(".");
      // if (index != -1) {
      //   var arrStr = [];
      //   arrStr = String(withdrawAmount).split(".");
      //   if (arrStr[1].length == 2 || arrStr[1].length == 3) {
      //     this.maxlength = 4;
      //   } else {
      //     this.maxlength = 6;
      //   }
      //   if (this.rooms_val.length > 4) {
      //     this.rooms_val = this.rooms_val.slice(0, 6);
      //   }
      // } else {
      //   if (this.rooms_val.length > 6) {
      //     this.rooms_val = this.rooms_val.slice(0, 6);
      //   }
      // }
    },
    //获取当前时间
    GetDate() {
      var date = new Date();
      var seperator1 = "-";
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var strDate = date.getDate();
      if (month >= 1 && month <= 9) {
        month = "0" + month;
      }
      if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
      }
      this.check_date = year + seperator1 + month + seperator1 + strDate; //散客入住时间
      var leave_date = year + seperator1 + month + seperator1 + strDate; //散客离店时间
      this.leave_date = this.addDate(leave_date, 1);

      this.startDate = year + seperator1 + month + seperator1 + strDate; //散客入住的开始时间限制
      var leave_startDate = year + seperator1 + month + seperator1 + strDate; //散客离店开始时间限制
      this.leave_startDate = this.addDate(leave_startDate, 1);
      this.company_startDate = year + seperator1 + month + seperator1 + strDate; //单位入住的开始时间限制
      var company_leave_startDate =
        year + seperator1 + month + seperator1 + strDate; //单位离店开始时间限制

      this.company_leave_startDate = this.addDate(company_leave_startDate, 1);
      this.company_check_date =
        year + seperator1 + month + seperator1 + strDate;
      year + seperator1 + month + seperator1 + strDate; //单位入住时间
      var company_leave_date = year + seperator1 + month + seperator1 + strDate; //单位离店时间
      this.company_leave_date = this.addDate(company_leave_date, 1);
    },
    DateMinus(date1, date2) {
      //date1:小日期   date2:大日期
      var sdate = new Date(date1);
      var now = new Date(date2);
      var days = now.getTime() - sdate.getTime();
      var day = parseInt(days / (1000 * 60 * 60 * 24));
      return day;
    },
    //定义时间算法加一天
    addDate(date, days) {
      if (days == undefined || days == "") {
        days = 0;
      }
      var date = new Date(date);
      date.setDate(date.getDate() + days);
      var month = date.getMonth() + 1;
      var day = date.getDate();
      return (
        date.getFullYear() +
        "-" +
        this.getFormatDate(month) +
        "-" +
        this.getFormatDate(day)
      );
    },
    //定义时间算法减一天
    addDate_reduce(date, days) {
      if (days == undefined || days == "") {
        days = 1;
      }
      var date = new Date(date);
      date.setDate(date.getDate() - days);
      var month = date.getMonth() + 1;
      var day = date.getDate();
      return (
        date.getFullYear() +
        "-" +
        this.getFormatDate(month) +
        "-" +
        this.getFormatDate(day)
      );
    },
    getFormatDate(arg) {
      if (arg == undefined || arg == "") {
        return "";
      }
      var re = arg + "";
      if (re.length < 2) {
        re = "0" + re;
      }
      return re;
    }
  }
};
</script>
<style lang="less">
.booking_add {
  position: absolute;
  width: 100%;
  // height: 100%;
  height: 12rem;
  top: 0;
  left: 0;
  .title {
    .weui-cell__ft:after {
      border-style: hidden;
    }
    .check {
      .weui-cell {
        color: #bdbdbd;
        padding: 0;
        padding-left: 0.65rem !important;
      }
      .weui-cell__ft {
        position: absolute;
        top: 0.4rem;
        left: 0.25rem;
        .vux-cell-value {
          color: #333333;
        }
      }
    }
    .leave {
      .weui-cell {
        color: #bdbdbd;
        padding: 0;
        div {
          width: 100%;
          padding-right: 0.65rem;
        }
      }
      .weui-cell__ft {
        position: absolute;
        top: 0.4rem;
        right: 0;
        padding-right: 0.25rem !important;
        .vux-cell-value {
          color: #333333;
        }
      }
    }
  }
  .booking_center {
    .vux-no-group-title {
      margin-top: 0;
    }
    .weui-cells:before {
      border: none;
    }
    .vux-popup-picker-select {
      text-align: left !important;
    }
    .weui-cell {
      font-size: 0.3rem;
      padding: 0.23rem 0.25rem !important;
    }
    .vux-cell-value {
      color: #333333;
    }
    .vux-popup-picker-placeholder {
      color: #333333 !important;
    }
  }
  .company_search {
    width: 100%;
  }
  .search_text {
    background: #fff;
  }
  .weui-cell_access .weui-cell__ft {
    display: block;
  }
  .weui-cell__ft:after {
    display: none !important;
  }
  .v-transfer-dom {
    .content {
      font-size: 0.3rem;
      p {
        margin-bottom: 0.25rem;
      }
      .tishi {
        width: 100%;
        overflow: hidden;
        img {
          float: right;
          margin-right: 0.5rem;
        }
      }
    }
  }
  .vux-toast {
    .weui-toast {
      width: auto !important;
      font-size: 0.24rem;
      .weui-toast__content {
        padding: 10px;
        font-size: 0.24rem;
      }
    }
  }
  .vux-cell-box:not(:first-child):before {
    border: none;
  }
}
</style>
<style scoped lang="less">
.booking_add {
  .tab {
    width: 100%;
    height: 0.9rem;
    background: #fff;
    border-top: 1px solid #f3f3f3;
    border-bottom: 1px solid #f3f3f3;
    padding: 0.25rem 0 0.25rem 0.25rem;
    span {
      display: inline-block;
      height: 0.28rem;
      font-size: 0.3rem;
      color: rgba(50, 50, 50, 1);
      line-height: 0.28rem;
    }
    .tab_type {
      width: 1.3rem;
      margin-right: 0.31rem;
      display: inline-block;
    }
    .tab_radio {
      width: 5.55rem;
      display: inline-block;
      span {
        margin-right: 0.99rem;
        img {
          margin-bottom: 0.05rem;
        }
      }
    }
  }
  .booking_center {
    input {
      width: 4.8rem;
    }
    .cancel_rule {
      margin: 0.2rem;
      color: #bdbdbd;
      font-size: 0.24rem;
    }
  }
  .sk {
    .title {
      height: 0.88rem;
      background: #fff;
      position: relative;
      border-bottom: 1px solid #f3f3f3;
      div {
        display: inline-block;
      }
      .check {
        width: 3rem;
        .check_cont {
          margin-left: 0.65rem;
          height: 0.28rem;
          font-size: 0.3rem;
          color: rgba(161, 161, 161, 1);
          line-height: 0.28rem;
          margin-top: 0.14rem;
          margin-bottom: 0.1rem;
        }
        .check_time {
          margin-left: 0.25rem;
          height: 0.2rem;
          font-size: 0.24rem;
          color: #323232;
          line-height: 0.28rem;
        }
      }
      .total {
        width: 1.5rem;
        height: 0.5rem;
        border: 1px solid rgba(135, 42, 145, 1);
        color: #872a91;
        border-radius: 0.25rem;
        position: absolute;
        top: 0.19rem;
        text-align: center;
      }
      .leave {
        float: right;
        text-align: right;
        width: 2.83rem;
        .leave_cont {
          margin-right: 0.65rem;
          height: 0.28rem;
          font-size: 0.3rem;
          color: rgba(161, 161, 161, 1);
          line-height: 0.28rem;
          margin-top: 0.14rem;
          margin-bottom: 0.1rem;
        }
        .leave_time {
          margin-right: 0.25rem;
          height: 0.2rem;
          font-size: 0.24rem;
          color: #323232;
          line-height: 0.28rem;
        }
      }
    }
    .booking_cont {
      height: 0.88rem;
      background: #fff;
      padding: 0.25rem 0.27rem 0.25rem 0.25rem;
      font-size: 0.3rem;
      border-bottom: 1px solid #f3f3f3;
      span {
        height: 0.28rem;
        line-height: 0.28rem;
        display: inline-block;
        .input {
          padding: 0;
        }
        .colour {
          color: red;
        }
      }
      .cont {
        width: 1.35rem;
      }
      .money {
        color: red;
      }
      .between {
        float: right;
      }
    }
  }
  .dw {
    // margin-bottom: 520px;
    .company {
      height: 0.88rem;
      line-height: 0.88rem;
      background: #fff;
      border-bottom: 1px solid #f3f3f3;
      position: relative;
      .cont {
        height: 0.28rem;
        font-size: 0.3rem;
        margin-left: 0.25rem;
        color: rgba(50, 50, 50, 1);
        margin-right: 0.31rem;
      }
      .input {
        width: 50%;
      }
      .company_img_r {
        position: absolute;
        right: 0.18rem;
      }
    }
    .title {
      height: 0.88rem;
      background: #fff;
      position: relative;
      border-bottom: 1px solid #f3f3f3;
      div {
        display: inline-block;
      }
      .check {
        width: 3rem;
        .check_cont {
          margin-left: 0.65rem;
          height: 0.28rem;
          font-size: 0.3rem;
          color: rgba(161, 161, 161, 1);
          line-height: 0.28rem;
          margin-top: 0.14rem;
          margin-bottom: 0.1rem;
        }
        .check_time {
          margin-left: 0.25rem;
          height: 0.2rem;
          font-size: 0.24rem;
          color: #323232;
          line-height: 0.28rem;
        }
      }
      .total {
        width: 1.5rem;
        height: 0.5rem;
        border: 1px solid rgba(135, 42, 145, 1);
        color: #872a91;
        border-radius: 0.25rem;
        position: absolute;
        top: 0.19rem;
        text-align: center;
      }
      .leave {
        float: right;
        text-align: right;
        width: 2.83rem;
        .leave_cont {
          margin-right: 0.65rem;
          height: 0.28rem;
          font-size: 0.3rem;
          color: rgba(161, 161, 161, 1);
          line-height: 0.28rem;
          margin-top: 0.14rem;
          margin-bottom: 0.1rem;
        }
        .leave_time {
          margin-right: 0.25rem;
          height: 0.2rem;
          font-size: 0.24rem;
          color: #323232;
          line-height: 0.28rem;
        }
      }
    }
    .booking_cont {
      height: 0.88rem;
      background: #fff;
      padding: 0.25rem 0.27rem 0.25rem 0.25rem;
      font-size: 0.3rem;
      border-bottom: 1px solid #f3f3f3;
      span {
        height: 0.28rem;
        line-height: 0.28rem;
        display: inline-block;
        .input {
          padding: 0;
        }
        .colour {
          color: red;
        }
      }
      .cont {
        width: 1.35rem;
      }
      .money {
        color: red;
      }
      .between {
        float: right;
      }
    }
  }
  .footer {
    width: 100%;
    height: 1.19rem;
    line-height: 1.19rem;
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    font-size: 0.3rem;
    padding: 0 0.25rem;
    z-index: 1001;
    .price {
      // flex: 1;
      width: 2.5rem;
      color: red;
    }
    .Detailed {
      flex: 1;
      padding-left: 0.3rem;
    }
    .btn {
      flex: 1;
      button {
        // width: 2rem;
        height: 0.8rem;
        line-height: 0.8rem;
        float: right;
        margin-top: 0.2rem;
        border-radius: 0.08rem !important;
        background: #872a91 !important;
      }
      .class-b {
        width: 2.4rem;
      }
    }
  }
}
.transfer {
  padding: 0.25rem;
  .props_title {
    overflow: hidden;
    margin-top: 0.25rem;
    text-align: right;
    .props_totl {
      float: left;
    }
    .props_money {
    }
  }
  .vux-no-group-title {
    margin-top: 0;
  }
  .props_totl {
  }
  .vux-popup-dialog {
    bottom: 1.15rem;
    background: #fff !important;
    padding: 0 0.25rem;
  }
}
</style>
